<!--
 * @Author: your name
 * @Date: 2022-04-29 15:40:14
<<<<<<< HEAD
 * @LastEditTime: 2022-05-07 14:46:47
=======
 * @LastEditTime: 2022-05-07 12:51:16
>>>>>>> 77ecc11d2b58f992a0b2e5d3d36785eb5e0e8e93
 * @LastEditors: 2551289397@qq.com 2551289397@qq.com
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \gitcode\html\addOrder.html
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>退货/退款订单</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
    <link rel="stylesheet" href="../layui/font/iconfont.woff">
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        
        #tubiaofont {
            height: 60px;
            background-color: rgb(240, 244, 246);
        }
        
        #tubiaofont span {
            display: inline-block;
            height: 60px;
            line-height: 60px;
            color: gray;
            font-size: 15px;
        }
        
        #tubiaofont span:first-child {
            color: blue;
            font-size: 18px;
        }
        
        #tabdiv {
            width: 100%;
            background-color: white;
            overflow: hidden;
        }
        
        #tabdiv>div>p {
            width: 100%;
            padding: 20px 0;
            background-color: rgb(236, 239, 241);
        }
        
        #tabdiv>table {
            width: 100%;
            text-align: center;
        }
        
        tr {
            border: 1px solid gainsboro;
            height: 50px;
        }
        /* #DIB1,
        #DIB2,
        #DIB3 {
            width: 100px;
            border: 1px solid gray;
            background-color: rgba(1, 1, 1, 0);
            padding: 5px 0;
            border-radius: 2px;
        } */
        
        tbody tr:hover {
            background-color: #e8e8e8;
        }
        
        #show form {
            margin: 0 2%;
            width: 10%;
            float: left;
            height: 38px;
        }
        
        .clear::after {
            content: '';
            display: block;
            clear: both;
        }
        
        .sousuo {
            width: 5%;
            height: 38px;
        }
        
        #showbtn {
            background-color: white;
            color: black;
            border: 1px solid black;
            box-sizing: border-box;
        }
        
        #showcontent {
            width: 100%;
            box-sizing: border-box;
            padding: 1%;
        }
        
        #addbtn {
            width: 8%;
            height: 38px;
            float: left;
            box-sizing: border-box;
            margin-right: 62%;
        }
        
        #tanchukuang,
        #show {
            width: 95%;
            padding: 0 2.5% 2.5% 2.5%;
            background-color: rgb(240, 244, 246);
        }
        
        #tanchukuang {
            display: none;
        }
        
        #addOrderpassege {
            width: 95%;
            padding: 0 2.5% 2.5% 2.5%;
            background-color: rgb(240, 244, 246);
        }
        
        #tubiaofont,
        #tubiao {
            height: 60px;
            background-color: rgb(240, 244, 246);
        }
        
        #popup_box {
            width: 100%;
            background-color: white;
            padding-bottom: 20px;
            overflow: hidden;
        }
        
        #popup_box>p {
            padding: 14px 0;
            width: 100%;
            padding: 20px 0;
            background-color: rgb(236, 239, 241);
            margin-bottom: 1.5%;
        }
        
        #popup_box>p>span {
            display: inline-block;
            width: 100px;
            border: 1px solid gray;
            background-color: white;
            padding: 0.3% 0;
            text-align: center;
            margin-left: 77.8%;
            border-radius: 2px;
        }
        
        #popup_box h3 {
            color: #1ab394;
            font-weight: 800;
        }
        
        #popup_box>div {
            width: 90%;
            margin: 0 auto;
            border-bottom: 1px dashed black;
            margin-bottom: 2%;
        }
        
        #popup_box>div>div {
            width: 100%;
            margin: 2% 0;
            padding-left: 10%;
        }
        
        #popup_box>div>div>i:nth-of-type(1) {
            margin-right: 20%;
        }
        
        #popup_box>div>div>i {
            color: red;
        }
        
        #addOrderpassege #popup_box>div>div>input,
        #addOrderpassege #popup_box>div>div>select {
            display: inline-block;
            width: 18%;
            height: 38px;
            box-sizing: border-box;
            border: 1px solid black;
        }
        
        #popup_box>div>div>span {
            display: inline-block;
            width: 10%;
            text-align: center;
        }
        
        #tijiao,
        #addtijiao {
            width: 6%;
            margin-left: 45%;
            height: 38px;
        }
        
        #chongzhi,
        #addchongzhi {
            height: 38px;
            width: 6%;
            box-sizing: border-box;
            background-color: white;
            color: black;
            border: 1px solid black;
        }
        
        table {
            width: 100%;
            text-align: center;
        }
        
        .tbdashed {
            width: 90%;
            margin: 2% auto;
            border-top: 1px dashed black;
            border-bottom: 1px dashed black;
            padding: 1.5% 0;
            overflow: hidden;
        }
        
        .tbdashed>div {
            width: 50%;
            float: left;
            text-align: center;
        }
        
        .tbdashed>div>div {
            margin: 5% 0;
        }
        
        .tbdashed>div>div>span {
            display: inline-block;
            width: 18%;
            text-align: center;
        }
        /* #test1 {
            width: 100%;
            box-sizing: border-box;
            padding: 1% 1%;
        } */
        
        #footerbtn {
            float: left;
            width: 50%;
        }
        
        #page {
            width: 30%;
            float: right;
            text-align: center;
        }
        
        #page button {
            width: 5%;
        }
        
        #addOrderpassege {
            display: none;
        }
        
        #piLiangAndFenYe {
            margin: 1% 0;
            height: 50px;
            position: relative;
        }
        
        #test1 {
            padding: 5px 10px;
            margin-top: 2px;
            float: right;
        }
        
        #delMuch,
        #DIB2,
        #DIB3 {
            width: 100px;
            height: 30px;
            border: 1px solid gray;
            background-color: rgba(1, 1, 1, 0);
            padding: 5px 0;
            margin-top: 10px;
            margin-left: 1%;
            border-radius: 2px;
            float: left;
        }
        
        #fenYe {
<<<<<<< HEAD
            height: 30px;
=======
            width: 400px;
            height: 30px;
            margin-left: 1000px;
>>>>>>> 77ecc11d2b58f992a0b2e5d3d36785eb5e0e8e93
            border-style: none;
        }
        
        #fenYe>div {
            float: left;
        }
        
        #fenYe .fenyepag {
            width: 90px;
            height: 30px;
            line-height: 26px;
            margin: 7px 5px;
            border-style: none;
        }
        
        #test1 button {
            width: 40px;
            height: 30px;
            line-height: 26px;
            margin: 0 5px;
            border-style: none;
        }
        
        #fenYe {
            position: absolute;
            right: 1%;
        }
        
        #fenYe>div {
            float: right;
        }
        
        .cyan {
            background-color: rgb(0, 150, 136);
        }
    </style>
</head>

<body>
    <!-- 界面 -->
    <div id="show">
        <div id="tubiaofont">
            <span class="layui-icon layui-icon-home"></span>
            <span>&nbsp;&gt;&gt;&nbsp;</span>
            <span>订单</span>
            <span>&nbsp; &gt;&gt;&nbsp;</span>
            <span>退货/退款订单</span>
        </div>

        <div id="tabdiv" class="clear">
            <div class="clear">
                <p>订单列表</p>
            </div>
            <div id="showcontent">
                <button id="addbtn" class="layui-btn">添加订单</button>
                <form action="" class="layui-form ">
                    <select name="city" lay-verify="">
                    <option value=""  class="111">全部</option>
                    <option value="010" >待审核</option>
                    <option value="021">已审批</option>
                  </select>
                </form>
                <button class="layui-btn layui-btn-sm query sousuo">查询</button>
                <button class="layui-btn layui-btn-sm reset sousuo" id="showbtn">返回</button>
            </div>
            <table class="ui-usertable" id="test" lay-filter="demo">
                <!-- 表格的总宽度以定，高度以定，根据自己的表格的具体内容进行排版 -->

                <!-- 按钮的样式 -->
                <thead>
                    <tr>
                        <th><input type="checkbox" class="cbxAll"></th>
                        <th>ID</th>
                        <th>退款流水号</th>
                        <th>订单编号</th>
                        <th>会员名</th>
                        <th>退款类型</th>
                        <th>状态</th>
                        <th colspan="2"><span>操作</span></th>
                    </tr>
                </thead>
                <tbody class="pagetable">

                </tbody>
            </table>

            <div id="piLiangAndFenYe" class="clear">
                <button id="delMuch">反选</button>
                <button id="DIB2">批量删除</button>
                <button id="DIB3">批量审批</button>
                <div id="fenYe" class="clear">
                    <div>
                        <button id="pagUp" class="fenyepag">下一页</button>
                    </div>
                    <div id="test1"></div>
                    <div>
                        <button id="pagDow" class="fenyepag">上一页</button>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <div id="tanchukuang">
        <div id="tubiaofont">
            <span class="layui-icon layui-icon-home"></span>
            <span>&gt;&gt;</span>
            <span>订单</span>
            <span>&gt;&gt;</span>
            <span>退货/退款订单</span>
            <span>&gt;&gt;</span>
            <span>修改订单</span>
        </div>
        <div id="popup_box">
            <p>退回订单操作 <span class="returnList">返回列表</span> </p>
            <!-- 输入框，我只做两个作为横向的排版，后面的根据自己的内容在后面添加  -->
            <table class="ui-usertable" id="test" lay-filter="demo">
                <thead>
                    <tr>
                        <th>商品编号</th>
                        <th>商品名称</th>
                        <th>成交价（元）</th>
                        <th>单重(kg)</th>
                        <th>购买数量</th>
                        <th>总计金额（元）</th>
                    </tr>
                </thead>
                <tbody class="modtable">
                </tbody>
            </table>
            <section class="tbdashed ">
                <h3>订单信息</h3>
                <div>
                    <div><span>订单编号</span><span>1533019644791</span></div>
                    <div><span>订单状态</span><span>未确认</span></div>
                    <div><span>配送状态</span><span>未发货</span></div>
                    <div><span>订单总金额</span><span>6398</span></div>
                </div>
                <div>
                    <div><span>买家用户名</span><span>test1</span></div>
                    <div><span>支付状态</span><span>未支付</span></div>
                    <div><span>订单总金额</span><span>6398</span></div>
                    <div><span>支付方式</span><span>网上支付</span></div>
                </div>
            </section>
            <section class="tbdashed ">
                <h3>退货信息</h3>
                <div>
                    <div><span>退款编号</span><span>1533019644791</span></div>
                    <div><span>退款类型</span><span>未确认</span></div>

                </div>
                <div>
                    <div><span>退款状态</span><span>已完成</span></div>
                    <div><span>退款金额</span><span>6398</span></div>
                </div>
            </section>
            <button id="tijiao" class="layui-btn layui-btn-sm">审批</button>
            <button id="chongzhi" class="layui-btn layui-btn-sm">取消</button>
        </div>
    </div>
    <div id="addOrderpassege">

        <div id="tubiaofont">
            <span class="layui-icon layui-icon-home"></span>
            <span>&gt;&gt;</span>
            <span>订单</span>
            <span>&gt;&gt;</span>
            <span>订单管理</span>
            <span>&gt;&gt;</span>
            <span>新增退货订单</span>
        </div>
        <div id="popup_box">
            <p>订单详情 <span class="returnList">返回列表</span> </p>
            <div>
                <h3>新增退货订单</h3>
                <div>

                    <span>订单编号</span>
                    <input class="firstinput" type="text" name="" id="">
                    <span>买家用户名</span>
                    <input type="text" name="" id="">
                </div>
                <div class="clear">
                    <span>商品类型</span>
                    <select name="" id="orderstoretype" class="myorder">
                       <option value="0">请选择</option>
                       <option value="sx">苹果</option>
                       <option value="hw">华为</option>
                       <option value="vivo">vivo</option>
                       <option value="bjb">笔记本</option>
                       <option value="iPad">iPad</option>
                       <option value="fz">服装</option>
                   </select>
                    <span>商品名称</span>
                    <select name="" id="orderstorename">
                       <option value="names">请选择</option>
                   </select>
                </div>
                <div class="clear">
                    <span>退款状态</span>
                    <select name="" id="" class="myorder">
                       <option value="orderStatus">请选择</option>
                       <option value="1" class="mysure">未发货,申请退货</option>
                       <option value="2">已审批</option>
                   </select>
                    <span>状态</span>
                    <select name="" id="">
                       <option value="paymentStatus">请选择</option>
                       <option value="1">已完成</option>
                   </select>

                </div>
                <div>

                    <span>订单金额</span>
                    <input type="text" name="" id="">
                </div>

            </div>
            <button id="addtijiao" class="layui-btn layui-btn-sm">提交</button>
            <button id="addchongzhi" class="layui-btn layui-btn-sm">返回</button>
        </div>

    </div>
    <script src="../js/jQuery.3.6.0-uncompress.js"></script>
    <script src="../layui/layui.js"></script>
    <script src="../js/jQuery.3.6.0-uncompress.js"></script>
    <script src="../layui/layui.js"></script>
    <script src="../js/database.js"></script>
    <script src="../js/tuihuoorder.js">
    </script>
</body>

</html>